import echarts from 'echarts';
// 引入柱状图
import 'echarts/lib/chart/bar';
// 引入提示框和标题组件
import 'echarts/lib/component/tooltip';
import 'echarts/lib/component/title';
import storageApi from '../../../core/storage/storage';

function consProblemNumController($rootScope, $scope, homeStatsService) {
  'ngInject';

  const date = new Date();
  this.month = (date.getMonth() + 1).toString();

  // 施工队问题数量
  this.getConsProblemNum = () => {
    this.hasConsProblemNum = true;
    const consName = [];
    const series = [];
    this.params = {
      orgId: $scope.orgId,
      month: this.month || '1',
    };
    homeStatsService
      .queryConsProblemNum({ mapParams: this.params, page: 1, size: 5 })
      .then((res) => {
        if (res.success) {
          this.consProblemNum = res.rows;
          if (this.consProblemNum && this.consProblemNum.length > 0) {
            this.hasConsProblemNum = false;
            this.consProblemNum.forEach((item, index) => {
              consName.push(item.name);
              series.push({
                value: item.total,
                name: item.name,
              });
            });
          }
          this.initEchart(consName, series);
        } else {
          this.hasConsProblemNum = true;
        }
      });
  };

  this.initEchart = (name, series) => {
    const option1 = {
      tooltip: {
        trigger: 'item',
        formatter: '{a} <br/>{b}: {c} ({d}%)',
      },
      color: ['#7bd1db', '#db9d86', '#ce81cf', '#008bdd', '#d6ca6e'],
      legend: {
        top: 20,
        data: name,
      },
      toolbox: {
        show: true,
        feature: {},
      },
      calculable: true,
      series: [
        {
          name: '问题数量',
          type: 'pie',
          radius: ['35%', '55%'],
          center: ['50%', '60%'],
          data: series,
          label: {
            normal: {
              show: false,
              position: 'outer',
              formatter: '{b}:{c}({d}%)',
            },
          },
          itemStyle: {
            emphasis: {
              shadowBlur: 10,
              shadowOffsetX: 0,
              shadowColor: 'rgba(0, 0, 0, 0.5)',
            },
          },
        },
      ],
    };
    const myChart = echarts.init(document.getElementById('cons-in-problem'));
    this.myChart = myChart;
    myChart.setOption(option1);
  };

  this.init = () => {
    this.data = [
      {
        id: '1',
        name: '1月',
      }, {
        id: '2',
        name: '2月',
      }, {
        id: '3',
        name: '3月',
      }, {
        id: '4',
        name: '4月',
      }, {
        id: '5',
        name: '5月',
      }, {
        id: '6',
        name: '6月',
      }, {
        id: '7',
        name: '7月',
      }, {
        id: '8',
        name: '8月',
      }, {
        id: '9',
        name: '9月',
      }, {
        id: '10',
        name: '10月',
      }, {
        id: '11',
        name: '11月',
      }, {
        id: '12',
        name: '12月',
      }];

    $scope.$watch('$consProblemNumCtrl.hasConsProblemNum', (newVal) => {
      if (!newVal) {
        setTimeout(() => {
          this.myChart.resize({
            width: 'auto',
            height: 'auto',
          });
        }, 500);
      }
    });
  };

  this.getConsProblemNum();
  this.init();
}

export default consProblemNumController;
